
@import './vant-reset';

page {
    font-size:30rpx;
    font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica,
      Segoe UI, Arial, Roboto, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft Yahei',
      sans-serif;
    background:#F8F8F8;height:100%;
}

.page-index{
    position:relative;   
    .swiper-view{
        padding:0 30rpx;margin-bottom:30rpx;
        .swiper {
            width: 690rpx;
            height: 392rpx;
            overflow:hidden;
            border-radius:16rpx;
            image {
                width: 690rpx;
                height: 392rpx;
            }
        }
    }
    .menu{
        padding:30rpx;
        image{width:100%;height:450rpx;}
    }
        
    .notice-block{
        max-height:800rpx;min-width:400rpx;
        .content{padding:30rpx;color:#666;}
    }
}
.base-status{
    &-0{color:$red;}
    &-1{color:$green;}
}

.page-order{
    &-index{
        .van-tab--active{font-size:36rpx;color:$blue;font-weight:bold;}
        .order-list{
            padding:30rpx;
        }
        .fly-panel{
            .hd:after,.ft:after{display:none;}
            .hd{
                .value{
                    &.order-status{
                        &-0{color:$yellow;}
                        &-1{color:$blue;}
                        &-2{color:$red;}
                        &-3{color:$green;}
                    }
                }
            }
            .ft{
                .flex-block{
                    justify-content:space-between;
                }
            }
        }
    }
    &-detail{
        .header{
            padding:30rpx;background:$blue;
        }
        .process{
            padding: 30rpx 30rpx 30rpx 60rpx;
            .bd-ul:not(:last-child){
                position:relative;
                &:before{
                    content:'';position:absolute;height:90%;border-left:1rpx dashed #ddd;left:-26rpx;top:40rpx;
                }
            }
            .bd-ul:last-child{
                .time:before{background:$blue;}
            }
            .time{padding-bottom:20rpx;position:relative;
                &:before{
                    content:'';position:absolute;width:10rpx;height:10rpx;border-radius:50%;background:grey;left:-30rpx;top:14rpx;
                }
            }
        }
    }
}

.page-doctor{
    &-detail{
        margin:0 30rpx;padding-top:30rpx;
        .fly-card{
            border-radius:12rpx;margin-bottom:30rpx;
            .title{
                font-size:34rpx;font-weight:bold;margin-bottom:30rpx;
            }
            .desc{
                line-height:50rpx;
            }
        }
        .fly-panel{
            .hd{
                background: linear-gradient(180deg, #E6F3FF 0%, rgba(255,255,255,0) 100%);display:flex;align-items:center;
                image{width:48rpx;height:48rpx;float:left;}
                .title{color:$blue;font-size:30rpx;margin-left:20rpx;}
                &:after{display:none;}
            }
        }
    }
}

.page-service{
    position:relative;
    &-submit{
        .bg{
            position:absolute;top:0;left:0;height:260rpx;width:100%;background:$blue;
            
        }
        .info{
            padding-top:30rpx;
            image{width:48rpx;height:48rpx;float:left;}
            .van-cell__title{font-size:30rpx;margin-left:20rpx;}
        }
        .service{
            .icon{color:#ddd;margin-right:20rpx;}
            .checked{
                .icon{color: $blue}
            }
        }
        .van-submit-bar__text{text-align:left;}
        .van-submit-bar__tip{color:$black;background:none;}
    }
    &-reserve{
        .cust{
            .item{
                background:$blue;color:#fff;padding-bottom:80rpx;
                .desc{
                    margin-top:20rpx;color:#fff;
                    image{width:32rpx;height:32rpx;float:left;margin-right:20rpx;}
                }
                .toggle{
                    .van-button{
                        background:#E6F3FF;color:$blue;
                    }
                    image{width:32rpx;height:32rpx;float:left;margin-right:20rpx;}
                }
            }
        }
        .info{
            margin-top:-120rpx;
        }
        .fly-panel{
            margin-bottom:0;
            .hd{
                .title{
                    color:#666;font-weight:normal;
                }
                .van-tag{
                    color:$blue;background:#E6F3FF;
                }
                &:after{
                    display:none;
                }
            }
        }
        .banner{
            padding:0 30rpx 180rpx 30rpx;
            image{width:100%;height:140rpx;}
        }
    }
}

.page-usercenter{
    .header{
        position:relative;background:$blue;color:#fff;padding:30rpx 30rpx;overflow:hidden;
        .fly-card{
            .item{background:none;}
            .thumb{
                width:100rpx;height:100rpx;
            }
            .content{
                .title{font-size:48rpx;}
                .desc{padding-top:10rpx;color:#fff;}
                &:after{display:none;}
            }

        }
        .total-list{
            text-align:center;
            .num{font-weight:bold;font-size:36rpx;}
            .title{font-size:26rpx;padding-top:10rpx;}
        }
    }
    .main{
        
    }
}


.page-cust{
    &-index{
        .list{padding-bottom:160rpx;padding-top:30rpx;
            .van-divider{margin:24rpx 0;}
        }

        .handle{
            color:#666;font-size:28rpx;
            .van-icon{padding-right:8rpx;}
        }
        .van-cell{
            &-group{
                border-radius:12rpx;overflow:hidden;margin-bottom:30rpx;
            }
            &__title,&__value{flex:auto;}
            &__value{
                display:flex;align-items:center;text-align:right;flex:unset;
                .van-icon{margin-right:10rpx;}
            }
            .name{font-size:34rpx;}
            .phone{font-size:30rpx;}
        }
    }
}

.full-btn{
    .van-submit-bar{background:none;}
    .van-submit-bar__bar{
        display: block;background:none;
        .van-submit-bar__button{
            width:100%;
        }
        .van-button--danger{background:$blue;border-color:$blue;}
    }
    
}

.page-login{
    padding:0 30rpx;height:100%;background:#fff;
    .logo{padding:160rpx 0;text-align:center;
        .name{color:$blue;font-size:42rpx;}
        .slogan{color:$grey;font-size:26rpx;}
    }
    .btn-group{
        button{margin-bottom:40rpx;}
    }
    van-checkbox{display:inline-block;}
    .agree-box{text-align:center;line-height:40rpx;}
    .service{position:absolute;bottom:88rpx;left:50%;transform:translateX(-50%);}

    &-phone{
        .tips{
            font-size:26rpx;color:$grey;text-align:center;padding-top:30rpx;
        }
    }
    &-password{
        .remember{
            padding-top:20rpx;display:inline-block;font-size:26rpx;
        }
    }

    &-agreement{

    }

    &-index{
        height:100%;background:#fff;
        .logo{
            color:$blue;padding: 50rpx 30rpx;
        }
        .form{
            margin:0 30rpx;
            .van-cell{
                border:1rpx solid #f7f7f7;border-radius:60rpx;margin-top:30rpx;background:#f9f9f9;
            }
        }
        .service{position:absolute;bottom:88rpx;left:50%;width:100%;transform:translateX(-50%);font-size:26rpx;text-align:center;
            van-checkbox{display:inline-block;}
            .agreement{display:inline-block;}
        }
    }
}
.find-password{
    .van-action-sheet__header{
        color:#fff;
    }
}
.reset-form{
    padding:30rpx;
    .hd{
        .title{
            font-size:36rpx;font-weight:bold;color:$blue;
        }
        .desc{
            font-size:30rpx;color:$grey;padding:10rpx 0 40rpx 0;
        }
    }
    .van-cell{
        border:1rpx solid #f7f7f7;border-radius:60rpx;margin-top:30rpx;background:#f9f9f9;
    }
    // 验证码输入
    .code-input-wrap {
        margin: 40rpx 0;
        position: relative;
        height: 100rpx;

        .code-input {
            position: absolute;
            left: 0;
            top: 0;
            height: 100rpx;
            width: 100%;
            opacity: 0;
            z-index: 99;
            outline: none;
        }
        .code-list {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100rpx;
            display: flex;
            justify-content: space-between;
            .code-list-item {
                // flex: 1;
                width: 90rpx;
                height: 100rpx;
                background: #ffffff;
                border-radius: 16rpx;
                font-size: 36rpx;
                font-weight: 700;
                color: #adb3ba;
                line-height: 100rpx;
                text-align: center;
                margin-right: 10rpx;
                z-index: 5;
                box-sizing: border-box;
                border:1rpx solid #ddd;
            }
            .code-list-item:last-child {
                margin-right: 0;
            }
            // .active-item {
            //     border: 2rpx solid #ff466d;
            // }
        }
    }
}

.popup-reply{
    .van-field__control--textarea{
        background:#f7f7f7;border-radius:8rpx;min-height: 60rpx;padding:10rpx 30rpx;
    }
}


// 公共区域的样式
.popup-block{
    .van-popup{background: $f8;}
    .popup-hd{
        padding: 30rpx;font-size:32rpx;background:#fff;
    }
}

.popup-img-preview{
    .van-popup{
        background:none;
    }
    .swiper-view{
        .swiper {
              width: 750rpx;
              height: 600rpx;
              image{
                position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);width:100%;height:100%;
              }
        }
    }
}